/**
 * @author 云离
 * @date: 2018/12/28
 */
import React, { Component } from "react";
import { connect } from "react-redux";
import { withRouter } from "react-router-dom";
import { message, Spin, Table, Pagination } from "antd";
import axios from "../../../apis/api";
import qs from "qs";
import {subtractMoney} from "../../../utils/number";

const mapStateToProps = (state, ownProps) => {
  return {};
};

const mapDispatchToProps = dispatch => {
  return {};
};

class BusinessStatTable extends Component {
  state = {
    loading: false,
    pageSize: 10,
    curPage: 1,
    tableData: {
      total: 0,
      rows: []
    },
    initCardForm: {},
    visibleDlg: false,
    cardFormTitle: "",
    cardFormType: "add",
    selectedRowKeys: []
  };

  componentDidMount() {
    this.searchTable(this.props)
  }

  componentWillReceiveProps(nextProps, nextContext) {
    if (nextProps.data !== this.props.data && nextProps.visible) {
      this.searchTable(nextProps);
    }
  }

  searchTable = async (props = this.props) => {
    const { pageSize, curPage } = this.state;
    const query = {
      orderByColumn: "createTime",
      isAsc: "desc",
      pageSize,
      pageNum: curPage
    };
    try {
      this.setState({
        loading: true
      });
      const result = await axios.post(
        "/channel/vwBusinessCashDayStat/list",
        qs.stringify(query)
      );
      if (result.code === 0) {
        this.setState({
          tableData: result,
          loading: false,
          selectedRowKeys: []
        });
      } else {
        this.setState({
          loading: false
        });
        message.error(result.msg);
      }
    } catch (e) {
      this.setState({
        loading: false
      });
      message.error(e.message);
    }
  };
  //翻页
  handlePageChange = (page, pageSize) => {
    this.setState(
      {
        curPage: page
      },
      this.searchTable
    );
  };

  onShowSizeChange = (current, pageSize) => {
    this.setState(
      {
        pageSize: pageSize,
        curPage: current
      },
      this.searchTable
    );
  };

  render() {
    const {
      loading,
      tableData,
      curPage,
      pageSize,
      selectedRowKeys
    } = this.state;
    const columns = [
      {
        title: "归属业务员",
        dataIndex: "salesmanUserName",
        key: "salesmanUserName"
      },
      {
        title: "商户名称",
        dataIndex: "userName",
        key: "userName"
      },
      {
        title: "统计时间",
        dataIndex: "createTime",
        key: "createTime"
      },
      {
        title: "入金金额",
        dataIndex: "sjjeSum",
        key: "sjjeSum",
        render: (text, record) => {
          return subtractMoney(text, record.handScoreSum || 0);
        }
      },
      {
        title: "出金金额",
        dataIndex: "hasCashSum",
        key: "hasCashSum"
      }
    ];

    return (
      <Spin spinning={loading}>
        <Table
          dataSource={tableData.rows}
          columns={columns}
          pagination={false}
          rowKey={"bankId"}
          scroll={{ x: true }}
        />
        <Pagination
          style={{ marginTop: 10, marginBottom: 20 }}
          total={tableData.total}
          showTotal={total => `共 ${total} 项`}
          pageSizeOptions={["10", "20", "50", "100", "500"]}
          showSizeChanger
          onShowSizeChange={this.onShowSizeChange}
          pageSize={pageSize}
          current={curPage}
          onChange={this.handlePageChange}
        />
      </Spin>
    );
  }
}

export default connect(
  mapStateToProps,
  mapDispatchToProps
)(withRouter(BusinessStatTable));
